<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>uuQuery.js - Reference</title>
<style type="text/css">@import url(./README.css);</style>
<script type="text/javascript" src="uuQuery.js"></script>
<script type="text/javascript" src="demo/iterator.js"></script>
</head>
<body>
<p>
   | <a href="http://code.google.com/p/uupaa-js-spinoff/">HOME</a>
   | <a href="./README.htm">README</a>
   | <a href="./DEMO.htm">DEMO</a>
   | <a href="./CLASS.htm">CLASS</a>
   | <a href="./CHANGELOG.htm">CHANGE LOG</a>
   | <a href="./DONATE.htm">DONATE</a>
   | <a href="./LICENSE.htm">LICENSE</a>
   |
</p>

<hr />
|
<a href="#uuQuery">uuQuery()</a> |
<a href="#uuQuery.id">uuQuery.id()</a> |
<a href="#uuQuery.tag">uuQuery.tag()</a> |
<a href="#uuQuery.className">uuQuery.className()</a> |

<hr />
<dl>
<!-- -->
  <dt><a name="uuQuery">uuQuery</a> - CSS Selector - CSSセレクタ</dt>
  <dd>
    <p>uuQuery(<i>expr</i>, <i>context</i> = document) は
       <i>context</i> 以下のノードツリーから CSSセレクタ式(<i>expr</i>) に一致する要素を検索し、
       発見した要素の配列( <a href="http://uupaa-js.googlecode.com/svn/trunk/GLOSSARY.htm#ElementArray">ElementArray</a> )を返します。</p>
    <p>特定のノード以下の要素を検索する場合は、<i>context</i> を指定します。
       全ノードを検索する場合は、<i>context</i> の指定を省略できます。</p>
<pre>
@param String  expr      - CSS セレクタを指定します。
@param Element [context] - 検索開始位置(コンテキスト)を指定します。デフォルトは document です。
                           document を指定するとノードツリーの先頭から全ての要素を検索します。
@return ElementArray     - 検索成功で <a href="http://uupaa-js.googlecode.com/svn/trunk/GLOSSARY.htm#ElementArray">ElementArray</a>( [element, ...] )を返します。
                           失敗で空の ElementArray( [] )を返します。
@throws TypeError "css(...)" 使用できないセレクタを指定した
</pre>

    <p><a href="#List_of_CSS_Selectors">使用可能なCSSセレクタの一覧</a>をご覧ください。</p>
    <p>HTMLDocument(content-type: text/html)なら タグの大小文字を無視して検索を行います(uuQuery("a")で&lt;a&gt;も&lt;A&gt;もヒット)。
       XMLDocument(content-type: text/xml, application/xml, application/xhtml+xml) なら タグの大文字/小文字を区別します。</p>
    <p>擬似要素のセミコロンは1つでも2つでも同じ結果になります(:before と ::before は同じ)。</p>
    <p>擬似要素(::first-line, ::first-letter, ::before, ::after)はエラーになりませんが、擬似要素の指定が無かったものとして扱います(div &gt; a::after は div &gt; a と同じ結果になります)。</p>
    <p>可能であればCSSセレクタ以外のセレクタ(uuQuery.id, uuQuery.tag, uuQuery.className)の利用も検討してください。これらは uuQuery() よりも高速に動作します。</p>

    <a href="javascript:uuQuery('span:nth-last-of-type(1)', uuQuery.id('two')).forEach(function(v){alert(v.innerHTML);});uuQuery('#one > SPAN:nth-last-of-type(1)').forEach(function(v) {alert(v.innerHTML);});void 0" class="run">Run</a>
<div>
  <div id="one"><span>span1</span><span>span2</span></div>
  <DIV id="two"><SPAN>SPAN3</SPAN><SPAN>SPAN4</SPAN></DIV>
</div>

<pre class="eg">
&lt;div&gt;
  &lt;div id="one"&gt;&lt;span&gt;span1&lt;/span&gt;&lt;span&gt;span2&lt;/span&gt;&lt;/div&gt;
  &lt;DIV id="two"&gt;&lt;SPAN&gt;SPAN3&lt;/SPAN&gt;&lt;SPAN&gt;SPAN4&lt;/SPAN&gt;&lt;/DIV&gt;
&lt;/div&gt;

<b>uuQuery</b>('span:nth-last-of-type(1)', uuQuery.id('two')).forEach(function(v) {
  alert(v.innerHTML); <u>// "SPAN4"</u>
});
<b>uuQuery</b>('#one &gt; SPAN:nth-last-of-type(1)').forEach(function(v) {
  alert(v.innerHTML); <u>// "span2"</u>
});
</pre>
  </dd>


  <dt><a name="List_of_CSS_Selectors">List of the available CSS selectors - uuQuery() で使用可能なCSSセレクタの一覧</a></dt>
  <dd>
    <p><a href="#uuQuery">uuQuery()</a> で使用可能な CSS セレクタの一覧です。</p>
    <p>uuQuery独自の <b>拡張セレクタ</b> についても説明します。</p>
    <table>
    <tr><th>CSS Selectors           </th><th>Note</th></tr>
    <tr><td>uuQuery('*')             </td><td>Universal selector<hr />全ての要素と一致します。
                                              <br /><br />More better(より良い方法): uuQuery.tag('*')</td></tr>
    <tr><td>uuQuery('#id')           </td><td>ID selectors<hr />属性id が "id" の要素と一致します。
                                              <br /><br />More better(よりよい方法): uuQuery.id('id')</td></tr>
    <tr><td>uuQuery('.classA')<br />
            uuQuery('.classA.classB')</td><td>Class selectors<hr />属性classが"classA"を含んでいる要素と一致します。
                                              <br />classAとclassBが指定されている場合は両方を含んでいる要素と一致します。
                                              <br /><br />More better(よりよい方法): uuQuery.className('classA'), uuQuery.className('classA classB')</td></tr>
    <tr><td>uuQuery('<i>E</i>')      </td><td>Type selectors<hr />全ての要素Eと一致します。
                                              <br /><br />More better(よりよい方法): uuQuery.tag('<i>E</i>')</td></tr>
    <tr><td>uuQuery('<i>E, F, G</i>') </td><td>Selectors group<hr />複数のセレクタを一度に指定できます。<br />個々のセレクタの評価結果を纏めて返します。<br />重複する要素は一つにまとめます。<br />いずれかのセレクタの評価が失敗すると全て失敗します(空の配列を返します)。</td></tr>
    <tr><td>uuQuery('<i>E F</i>')    </td><td>Descendant combinator<hr />要素Eの子孫の全ての要素Fと一致します。
                                              <br /><br />More better(よりよい方法): uuQuery.tag('<i>F</i>', <i>E</i>)</td></tr>
    <tr><td>uuQuery('<i>E > F</i>')   </td><td>Child combinator<hr />要素Eの子供の要素Fと一致します。</td></tr>
    <tr><td>uuQuery('<i>E + F</i>')</td><td>Adjacent sibling combinator<hr />要素EとFが兄弟で、要素Eと隣接する要素Fと一致します。<br />最大で1つの要素がヒットします。</td></tr>
    <tr><td>uuQuery('<i>E ~ F</i>')</td><td>General sibling combinator<hr />要素EとFが兄弟で、要素Eの後に存在する要素Fと一致します。<br />複数の要素がヒットする可能性があります。</td></tr>
    <tr><td>uuQuery('<i>E[A]</i>')    </td><td>Attribute selectors<hr />属性Aを持つ全ての要素Eと一致します。属性の値は問いません。</td></tr>
    <tr><td>uuQuery('<i>E[A=V]</i>')</td><td>Attribute selectors<hr />属性Aの値がVの全ての要素Eと一致します。</td></tr>
    <tr><td>uuQuery('<i>E[A~=V]</i>')</td><td>Attribute selectors<hr />属性Aの値がスペース区切りのリストで、<br />リストがVを含む全ての要素Eと一致します。</td></tr>
    <tr><td>uuQuery('<i>E[A|=V]</i>')</td><td>Attribute selectors<hr />属性Aの値がハイフン区切りのリストで、<br />"V"または"V-"で始まる単語を含む全ての要素Eと一致します。</td></tr>
    <tr><td>uuQuery('<i>E[A^=V]</i>')</td><td>Attribute selectors<hr />属性Aの値がVで始まる全ての要素Eと一致します。</td></tr>
    <tr><td>uuQuery('<i>E[A$=V]</i>')</td><td>Attribute selectors<hr />属性Aの値がVで終わる全ての要素Eと一致します。</td></tr>
    <tr><td>uuQuery('<i>E[A*=V]</i>')</td><td>Attribute selectors<hr />属性Aの値がVを含む全ての要素Eと一致します。</td></tr>








    <tr><td>uuQuery('<i>E</i>:not(expr)')</td><td>exprに一致しない要素Eと一致します。<br />expr には * , #<i>id</i> , .<i>class</i> および <i>E</i> を指定できます。</td></tr>
    <tr><td>uuQuery(':root')             </td><td>Pseudo-class<hr />ルート要素(HTML要素)と一致します。
                                              <br /><br />More better(よりよい方法): uuQuery.tag('html') or document.documentElement</td></tr>
    <tr><td>uuQuery('<i>E</i>:first-child')</td><td>Pseudo-class<hr />最初の子要素と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:last-child')</td><td>Pseudo-class<hr />最後の子要素と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:only-child')</td><td>Pseudo-class<hr />一人っ子と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:nth-child(<a href="#anb"><i>an+b</i></a>)')     </td><td>Pseudo-class<hr />先頭から数えて<br />(n|even|odd|an+b)番目の兄弟要素と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:nth-last-child(<a href="#anb"><i>an+b</i></a>)')</td><td>Pseudo-class<hr />末尾から数えて<br />(n|even|odd|an+b)番目の兄弟要素と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:first-of-type')</td><td>Pseudo-class<hr />E要素と同じ要素名の兄弟で、最初の兄弟と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:last-of-type')</td><td>Pseudo-class<hr />E要素と同じ要素名の兄弟で、最後の兄弟と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:only-of-type')</td><td>Pseudo-class<hr />要素Eの親からみてユニークなEであれば一致します。<br />兄弟にEがいれば一致しません。</td></tr>
    <tr><td>uuQuery('<i>E</i>:nth-of-type(<a href="#anb"><i>an+b</i></a>)')     </td><td>Pseudo-class<hr />E要素と同じ要素名の兄弟を先頭から数えて<br />(n|even|odd|an+b)番目の兄弟要素と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:nth-last-of-type(<a href="#anb"><i>an+b</i></a>)')</td><td>Pseudo-class<hr />E要素と同じ要素名の兄弟を末尾から数えて<br />(n|even|odd|an+b)番目の兄弟要素と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:empty')</td><td>Pseudo-class<hr />独身(子要素やテキストノードを持たない要素E)と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:lang(en)')</td><td>Pseudo-class<hr />要素のlang属性が"en"や"en-US"な要素と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:enabled')</td><td>Pseudo-class<hr />disabled 属性に "disabled" 以外の値が設定されている要素と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:disabled')</td><td>Pseudo-class<hr />disabled 属性に "disabled" が設定されている要素と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:checked')</td><td>Pseudo-class<hr />チェックされている要素(radiobox, checkbox)と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:link')</td><td>Pseudo-class<hr />未訪問のリンクを持つ要素と一致します。</td></tr>
    <tr><td>uuQuery('<i>E</i>:visited')</td><td>Pseudo-class<hr />訪問済みのリンクを持つ要素と一致します。この機能はプライバシーに配慮しOFFになっています。</td></tr>
    <tr><td>uuQuery('<i>E</i>:hover')</td><td>Pseudo-class<hr />マウスカーソルの真下に位置する要素Eと一致します。<br />IE等の一部のブラウザでは、Eにa要素のみ指定可能です。</td></tr>
    <tr><td>uuQuery('<i>E</i>:focus')</td><td>Pseudo-class<hr />フォーカスを持っている要素と一致します。<br />IE等の一部のブラウザでは、Eにa要素やフォーム部品のみ指定可能です。</td></tr>
    <tr><td>uuQuery('<i>E</i>:target')</td><td>Pseudo-class<hr />ページのURIのhashが示すid(またはname)属性を持つ要素と一致します。
                                              <br />ページのURIが ./index.html#topic1 の時に、
                                              <br />&lt;a id="topic1"&gt;&lt;/a&gt; や
                                              <br /> &lt;a name="topic1"&gt;&lt;/a&gt; とマッチします。</td></tr>
    <tr><td>uuQuery('<i>E</i>:first-line')<br />
            uuQuery('<i>E</i>::first-line')</td><td>Pseudo-element<hr />要素の先頭行と一致します。
                                              <br />実際には要素の先頭行を持つ要素と一致します。
                                              <br />つまり、div&gt;ul::first-line は div&gt;ul と同じ結果になります。</td></tr>
    <tr><td>uuQuery('<i>E</i>:first-letter')<br />
            uuQuery('<i>E</i>::first-letter')</td><td>Pseudo-element<hr />要素の先頭文字と一致します。
                                              <br />実際には要素の先頭文字を持つ要素と一致します。
                                              <br />つまり、div&gt;ul::first-letter は div&gt;ul と同じ結果になります。</td></tr>
    <tr><td>uuQuery('<i>E</i>:before')<br />
            uuQuery('<i>E</i>::before')</td><td>Pseudo-element<hr />要素の前に追加される擬似的な要素と一致します。
                                              <br />実際には要素の先頭行を持つ要素と一致します。
                                              <br />つまり、div&gt;ul::before は div&gt;ul と同じ結果になります。</td></tr>
    <tr><td>uuQuery('<i>E</i>:after')<br />
            uuQuery('<i>E</i>::after')</td><td>Pseudo-element<hr />要素の後ろに追加される擬似的な要素と一致します。
                                              <br />実際には要素の先頭文字を持つ要素と一致します。
                                              <br />つまり、div&gt;ul::after は div&gt;ul と同じ結果になります。</td></tr>



    <tr><th><a name="uuQueryExtend">Extend selectors</a></th><th>Note</th></tr>
    <tr><td><a name="uuQueryNotEqual"></a><b>uuQuery('<i>E[A!=V]</i>')</b></td><td>Attribute selectors - not equal operator<hr />属性Aの値がVと一致しない全ての要素Eと一致します。</td></tr>
    <tr><td><a name="uuQueryRegexp"></a><b>uuQuery('<i>E[A/="V"]</i>')</b>
            <br />
            <b>uuQuery('<i>E[A/="V"]</i></b>i<b>')</b></td><td>Attribute selectors - regexp operator<hr />属性 A の値が正規表現Vと一致する全ての要素 E と一致します。
                                            <br />正規表現フラグ(i)を指定すると、大小文字を無視して比較を行います。
                                            <br />\ は、\\ にします。
                                            <br />例: uuQuery('div[class/="hoge[\\d]+"]');
                                            <br />例: uuQuery('div{opacity/="0\\.[0-5]+"}');
                                            <br />V の前後はクォーテーション(" または ')で囲む必要があります。
                                        </td></tr>
    <tr><td><b>uuQuery('<i>E</i>:contains("Hello")')</b></td><td>Pseudo-class<hr />"Hello"を含んでいるテキストノードを持つ要素と一致します。</td></tr>
    <tr><td><a name="uuQueryAccount"></a><b>uuQuery('<i>E</i>:digit')</b></td><td>Account Pseudo-class<hr />テキストを持ち、テキストが数値として評価できる要素 E と一致します。</td></tr>
    <tr><td><b>uuQuery('<i>E</i>:negative')</b></td><td>Account Pseudo-class<hr />テキストを持ち、テキストが負の数値として評価できる要素 E と一致します。</td></tr>


    <tr><th><a name="uuQueryStyle">Copmuted style selectors</a></th><th>Note</th></tr>
    <tr><td><b>uuQuery('<i>E{PROP:V}</i>')</b>
            <br /><b>uuQuery('<i>E{PROP=V}</i>')</b></td>
                <td>Copmuted style selectors<hr />スタイルプロパティ PROP の計算された値が V と等しい 要素 Eと一致します。<br />PROP が長さや色を表す場合は、V を数値として評価し、<br />それ以外のケースでは文字列として評価します。</td></tr>
    <tr><td><b>uuQuery('<i>E{PROP!=V}</i>')</b></td>
                <td>Copmuted style selectors<hr />スタイルプロパティ PROP の計算された値が V と一致しない全ての要素 E と一致します。<br />PROP が長さや色を表す場合は、V を数値として評価し、<br />それ以外のケースでは文字列として評価します。</td></tr>
    <tr><td><b>uuQuery('<i>E{PROP*=V}</i>')</b></td>
                <td>Copmuted style selectors<hr />スタイルプロパティ PROP の計算された値が V を含む全ての要素 E と一致します。<br />V を文字列として評価します。</td></tr>
    <tr><td><b>uuQuery('<i>E{PROP^=V}</i>')</b></td><td>Copmuted style selectors<hr />スタイルプロパティ PROP の計算された値が V で始まる全ての要素 E と一致します。<br />V を文字列として評価します。</td></tr>
    <tr><td><b>uuQuery('<i>E{PROP$=V}</i>')</b></td><td>Copmuted style selectors<hr />スタイルプロパティ PROP の計算された値が V で終わる全ての要素 E と一致します。<br />V を文字列として評価します。</td></tr>
    <tr><td><b>uuQuery('<i>E{PROP/="V"}</i>')</b>
            <br /><b>uuQuery('<i>E{PROP/="V"}</i></b>i<b>')</b></td><td>Copmuted style selectors<hr />スタイルプロパティ PROP の計算された値が正規表現 V と一致する全ての要素 E と一致します。
                                            <br />正規表現フラグ(i)を指定すると、大小文字を無視して比較を行います。
                                            <br />V は文字列として評価します。
                                            <br />\ は、\\ にします。
                                            <br />例: uuQuery('div[class/="hoge[\\d]+"]');
                                            <br />例: uuQuery('div{opacity/="0\\.[0-5]+"}');
                                            <br />V の前後はクォーテーション(" または ')で囲む必要があります。
    </td></tr>
    <tr><td><b>uuQuery('<i>E{PROP&gt;=V}</i>')</b></td><td>Copmuted style selectors<hr />スタイルプロパティ PROP の計算された値が V 以上の値を持つ全ての要素 E と一致します。<br />V を数値として評価します。</td></tr>
    <tr><td><b>uuQuery('<i>E{PROP&lt;=V}</i>')</b></td><td>Copmuted style selectors<hr />スタイルプロパティ PROP の計算された値が V 以下の値を持つ全ての要素 E と一致します。<br />V を数値として評価します。</td></tr>
    <tr><td><b>uuQuery('<i>E{PROP&amp;=V1~V2}</i>')</b></td><td>Copmuted style selectors<hr />スタイルプロパティ PROP の計算された値が V1 から V2 の範囲を持つ全ての要素 E と一致します。<br />V1, V2 を数値として評価します。</td></tr>


    </table>
  </dd>
  <dt><a name="style">スタイルプロパティについて</a></dt>
  <dd>
    <p>スタイルプロパティ(E{...})の評価方法について説明します。</p>
    <p>スタイルプロパティは、document.defaultView.getComputedStyle(要素, "") または 要素.currentStyle から取得した計算済みの値を使用します。</p>
    <h4>色の扱いについて</h4>
色は数値化してから評価します。以下は全て同じ結果になります。
<pre>
<u>// 文字色が #ff0000 よりも小さい div 要素を選択</u>
uuQuery('div{color&lt;=#ff0000}');
uuQuery('div{color&lt;=#f00}');
uuQuery('div{color&lt;=red}');
uuQuery('div{color&lt;=RED}');
uuQuery('div{color&lt;=rgb(255,0,0)}');
</pre>
<p>transparent は black と同じ値として評価します(alpha値を無視します)。</p>
<p>W3C Named Color ( "pink" や "skyblue") も使えます。</p>

<p>背景色を評価する場合は、backgroundColor を使用します。簡略化プロパティ(background)は使えません</p>
<pre>
uuQuery('div{ backgroundColor &lt;= rgba(255,255,255,1) }');
</pre>

<p>比較オペレータ( :  や  =  や  != )を使用した場合は、数値化してから評価します。</p>
<pre>
<u>// これらは</u>
uuQuery('div{ color :  red }');
uuQuery('div{ color =  red }');
<u>// これと同じ結果になります</u>
uuQuery('div{ color = #FF0000 }');

<u>// これは</u>
uuQuery('div{ color != red }');
<u>// これと同じ結果になります</u>
uuQuery('div{ color != #FF0000 }');
</pre>
    <h4>不透明度の扱いについて</h4>
<p>不透明度は0.0～1.0の数値として扱います。</p>
<pre>
<u>// 不透明度が 0.5 ～ 1.0 の div 要素を選択</u>
uuQuery('div{opacity &amp;= 0.5~1}');
</pre>

    <h4>長さや、幅と高さについて</h4>
<p>top, left, right, bottom や、幅(width)と高さ(height)は px 単位の数値として評価します。
   pt や em 単位の値は、px に変換してから評価します。</p>
<pre>
&lt;style&gt;
  div {
    position: absolute;
    left: 10em; <u>/* em 単位で指定 */</u>
  }
&lt;/style&gt;
&lt;script&gt;
  <u>// position: absolute または position:fixed で、left が 100px 以下の div 要素を選択</u>
  <u>// 実際に一致するかどうかは、その時点のフォントサイズ次第</u>
  uuQuery('div{position/=absolute|fixed}{left&lt;=100}');
&lt;/script&gt;
</pre>

    <h4>URL について</h4>
<p>background-image は 前後の "url(" と ")" を除去した状態で文字列として評価します。
  <br />url(none) は "none" として評価します。</p>
<pre>
<u>// urlが.pngで終わるURLを選択</u>
uuQuery('div{backgroundImage/="\\.png$"}');

<u>// 背景画像を持たない要素(url="none")を選択</u>
uuQuery('div{ backgroundImage: "none" }');
</pre>

    <h4>レンジオペレーター(&amp;=)について</h4>
<p>&amp;= は、数値の範囲を指定するオペレータです、
  チルダ(~)で連結された値を2つ指定します(チルダが無い場合はエラーになります)</p>
<pre>
E{color&amp;=red~blue}
<u>// チルダの前後にスペースをいれることもできます。</u>
E{ color &amp;= red ~ blue }
</pre>
<p>比較は数値で行われます。</p>
<p>レンジオペレータは、比較演算子( &lt;= や &gt;= )を、2回使用するよりも良い方法です。</p>

<pre>
<u>// 比較演算子を2回使用するよりも、</u>
div { color &lt;= red }{ color &gt;= blue }

<u>// レンジオペレータのほうが効率的です。</u>
div { color &amp;= red~blue }

<u>// これも上記と同じ結果になります。</u>
div { color &amp;= blue~red }
</pre>
</dd>

  <dt><a name="anb">:nth-child(an+b) について</a></dt>
  <dd>
    <p>:nth-child(an+b), :nth-last-child(an+b), :nth-of-type(an+b), :nth-last-of-type(an+b) の an+b には計算式を指定します。
      <br />テーブルやリストの行をゼブラカラーにする場合などに多用されます。
    </p>
    <p>a には「何番目を繰り返し選択するか」を数値で指定します。a=2 なら順番的に2で割り切れる要素を選択し、a=3なら順番的に3で割り切れる要素を選択します。aを省略するか1を指定すると全ての要素を選択します。
      <br />b には「先頭から何番目以降の要素を選択するか」を数値で指定します。b=0なら先頭の要素を選択し、b=1なら先頭から2番目の要素を選択します。bを省略すると 0が指定されたものとして扱います。
    </p>
    <ul>
      <li>uuQuery("<i>E</i>:nth-child(3)"): 先頭から数えて4番目の兄弟要素と一致します。</li>
      <li>uuQuery("<i>E</i>:nth-child(even)"): 先頭から数えて偶数番目の兄弟要素と一致します。0,2,4...番目の要素が"even"と一致します。</li>
      <li>uuQuery("<i>E</i>:nth-child(odd)"): 先頭から数えて奇数番目の兄弟要素と一致します。1,3,5...番目の要素が"odd"と一致します。</li>
      <li>uuQuery("<i>E</i>:nth-child(2n)"): "even"と同じです。</li>
      <li>uuQuery("<i>E</i>:nth-child(2n+1)"): "odd"と同じです。</li>
      <li>uuQuery("<i>E</i>:nth-child(4n+1)"): 4で割って余りが0の番号を持つ要素を選択します。</li>
      <li>uuQuery("<i>E</i>:nth-child(4n+2)"): 4で割って余りが1の番号を持つ要素を選択します。</li>
      <li>uuQuery("<i>E</i>:nth-child(4n+3)"): 4で割って余りが2の番号を持つ要素を選択します。</li>
      <li>uuQuery("<i>E</i>:nth-child(4n+4)"): 4で割って余りが3の番号を持つ要素を選択します。</li>
      <li>uuQuery("<i>E</i>:nth-child(-n+3)"): 先頭から要素を3つ選択します。</li>
      <li>uuQuery("<i>E</i>:nth-last-child(-n+3)"): 末尾から要素を3つ選択します。</li>
    </ul>
  </dd>

<!-- -->
  <dt><a name="uuQuery.id">uuQuery.id</a> - ID Selector - IDセレクタ</dt>
  <dd>
    <p>uuQuery.id(<i>id</i>) は <i>id</i> と一致する id 属性を持つ要素を検索し、
       <a href="http://uupaa-js.googlecode.com/svn/trunk/GLOSSARY.htm#Element">Element</a> を返します。</p>
<pre>
@param String id        - ID を指定します。
@return Element/null    - 検索成功で要素の参照を返します。失敗で null を返します。
</pre>
    <a href="javascript:alert(uuQuery.id('uuQuery.id_ID1').innerHTML);alert(uuQuery.id('uuQuery.id_ID2').innerHTML);void 0" class="run">Run</a>
    <div id="uuQuery.id_ID1">uuQuery.id test div element 1</div>
    <div id="uuQuery.id_ID2">uuQuery.id test div element 2</div>

<pre class="eg">
&lt;div id="uuQuery.id_ID1"&gt;uuQuery.id test div element 1&lt;/div&gt;
&lt;div id="uuQuery.id_ID2"&gt;uuQuery.id test div element 2&lt;/div&gt;

alert(<b>uuQuery.id</b>('uuQuery.id_ID1').innerHTML); <u>// "uuQuery.id test div element 1"  with cache</u>
alert(<b>uuQuery.id</b>('uuQuery.id_ID2').innerHTML); <u>// "uuQuery.id test div element 2"  with cache</u>
</pre>
  </dd>

<!-- -->
  <dt><a name="uuQuery.tag">uuQuery.tag</a> - Tag/Element Selector - タグ(要素)セレクタ</dt>
  <dd>
    <p>uuQuery.tag(<i>tagName</i>, <i>context</i> = document) は
       <i>context</i> 以下のノードツリーから <i>tagName</i> と一致する要素を検索し、
          発見した要素の配列( <a href="http://uupaa-js.googlecode.com/svn/trunk/GLOSSARY.htm#ElementArray">ElementArray</a> )を返します。</p>
    <p>ワイルドカード("*")を指定すると全てのタグを検索します。</p>
<pre>
@param String  tagName   - タグ名を指定します。
                           ワイルドカード("*")を指定すると、全てのタグを検索します。
@param Element [context] - 検索開始位置(コンテキスト)を指定します。デフォルトは document です。
                           document を指定するとノードツリーの先頭から全ての要素を検索します。
@return ElementArray     - 検索成功で <a href="http://uupaa-js.googlecode.com/svn/trunk/GLOSSARY.htm#ElementArray">ElementArray</a>( [element, ...] )を返します。
                           失敗で空の ElementArray( [] )を返します。
</pre>
    <a href="javascript:uuQuery.tag('div',uuQuery.id('uuQuery.tag_Example')).forEach(function(v){alert(v.id);});void 0" class="run">Run</a>
<div id="uuQuery.tag_Example">
  <div id="uuQuery.tag_ID1">uuQuery.tag test div element 1</div>
  <div id="uuQuery.tag_ID2">uuQuery.tag test div element 2</div>
  <div id="uuQuery.tag_ID3">uuQuery.tag test div element 3</div>
</div>

<pre class="eg">
&lt;div id="uuQuery.tag_Example"&gt;
  &lt;div id="uuQuery.tag_ID1"&gt;uuQuery.tag test div element 1&lt;/div&gt;
  &lt;div id="uuQuery.tag_ID2"&gt;uuQuery.tag test div element 2&lt;/div&gt;
  &lt;div id="uuQuery.tag_ID3"&gt;uuQuery.tag test div element 3&lt;/div&gt;
&lt;/div&gt;

<b>uuQuery.tag</b>('div', uuQuery.id('uuQuery.tag_Example')).forEach(function(v) {
  alert(v.id); <u>// uuQuery.tag_ID1, uuQuery.tag_ID2, uuQuery.tag_ID3</u>
});
</pre>
  </dd>
<!-- -->
  <dt><a name="uuQuery.className">uuQuery.className</a> - Class Selector - クラスセレクタ</dt>
  <dd>
    <p>uuQuery.className(<i>className</i>, <i>context</i> = document) は
       <i>context</i> 以下のノードツリーから、次に示す2つの条件を満たす要素を検索し、
          発見した要素の配列( <a href="http://uupaa-js.googlecode.com/svn/trunk/GLOSSARY.htm#ElementArray">ElementArray</a> )を返します。</p>
    <ol>
      <li><i>className</i> が スペースを含まない文字列なら、element.className と <i>className</i> の値が完全に一致すること</li>
      <li><i>className</i> が スペースで区切られたクラス名の集合なら、element.className が <i>className</i> で指定されたクラス名を全て含んでいること</li>
    </ol>
    <p><i>className</i> には、スペース区切りで複数のクラス名を指定可能です。
      <br />要素(&lt;div class="bbb ccc aaa"&gt;&lt;/div&gt;)を検索するには、
      <br />uuQuery.className("aaa bbb") や uuQuery.className("aaa ccc") とすることができます。
    </p>
<pre>
@param String  className - クラス名を指定します。スペース区切りで複数のクラス名を指定することもできます。
@param Element [context] - 検索開始位置(コンテキスト)を指定します。デフォルトは document です。
                           document を指定するとノードツリーの先頭から全ての要素を検索します。
@return ElementArray     - 検索成功で <a href="http://uupaa-js.googlecode.com/svn/trunk/GLOSSARY.htm#ElementArray">ElementArray</a>( [element, ...] )を返します。
                           失敗で空の ElementArray( [] )を返します。
</pre>
    <a href="javascript:uuQuery.className('note white').forEach(function(v){alert(v.innerHTML);});" class="run">Run</a>
<div id="uuQuery.className_Example">
  <div class="white note">white note</div>
  <div class="super note">super note</div>
  <div class="note">note</div>
</div>

<pre class="eg">
&lt;div id="uuQuery.className_Example"&gt;
  &lt;div class="white note"&gt;white note&lt;/div&gt;
  &lt;div class="super note"&gt;super note&lt;/div&gt;
  &lt;div class="note"&gt;note&lt;/div&gt;
&lt;/div&gt;
<b>uuQuery.className</b>('note white').forEach(function(v) {
  alert(v.innerHTML); // "white note"
});
</pre>
  </dd>
</dl>

</body>
</html>
